.wrapper2 {
				position: absolute;
				-webkit-transform: translate(-50%, -50%);
				-moz-transform: translate(-50%, -50%);
				transform: translate(-50%, -50%);
				top: 50%;
				left: 50%;
			}
			
			
			.holder2 {
				overflow: hidden;
				height: 70px;
				background: rgba(255, 255, 255, 0);
				border-radius: 6px;
				position: relative;
				width: 70px;
				-webkit-transition: all 0.3s ease-in-out;
				-moz-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;
			}
			
			.wrapper2.active2 .holder2 {
				border-radius: 50px;
				height: 280px;/*更该上下*/
				background: rgba(0, 0, 0, 0.5);
				-webkit-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
				-moz-transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
				transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
			}
			
			
			
			
			.icon2 {
				width: 70px;
				height: 70px;
				border: none;
				border-radius: 6px;
				background: #FFF;
				padding: 0px;
				outline: none;
				position: relative;
				z-index: 2;
				float: right;
				cursor: pointer;
				-webkit-transition: all 0.3s ease-in-out;
				-moz-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;
				text-align: center;
			
			}
			.icon2 span{
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%);
				font-size: 30px;
			}
			
			.wrapper2.active2 .icon2 {
				width: 50px;
				height: 50px;
				margin: 10px;
				border-radius: 30px;
			}
			
			.wrapper2 .close {
				position: absolute;
				z-index: 1;
				top: 24px;
				right: 20px;
				width: 25px;
				height: 25px;
				cursor: pointer;
				-webkit-transform: rotate(-180deg);
				-moz-transform: rotate(-180deg);
				transform: rotate(-180deg);
				-webkit-transition: all .3s cubic-bezier(0.285, -0.450, 0.935, 0.110);
				-moz-transition: all .3s cubic-bezier(0.285, -0.450, 0.935, 0.110);
				transition: all .3s cubic-bezier(0.285, -0.450, 0.935, 0.110);
				-webkit-transition-delay: 0.2s;
				-moz-transition-delay: 0.2s;
				transition-delay: 0.2s;
			}
			
			.wrapper2.active2 .close {
				right: -50px;
				-webkit-transform: rotate(45deg);
				-moz-transform: rotate(45deg);
				transform: rotate(45deg);
				-webkit-transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);
				-moz-transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);
				transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);
				-webkit-transition-delay: 0.5s;
				-moz-transition-delay: 0.5s;
				transition-delay: 0.5s;
			}
			
			.wrapper2 .close::before,
			.wrapper2 .close::after {
				position: absolute;
				content: '';
				background: #FFF;
				border-radius: 2px;
			}
			
			.wrapper2 .close::before {
				width: 5px;
				height: 25px;
				left: 10px;
				top: 0px;
			}
			
			.wrapper2 .close::after {
				width: 25px;
				height: 5px;
				left: 0px;
				top: 10px;
			}
			
			@media screen and (max-width: 560px) {
				.wrapper2.active2 .holder2 {
					width: 200px;
				}
				
			